<template>
  <div class="flex headerRight pointer">
    <div
        class="flex1 text-align-center headerRight-text"
        :class="isActive === item.value ?'active':''"
        v-for="(item,index) in list"
        :key="item.value"
        @click="chooseType(item.value)"
    >
      {{ item.label }}
    </div>
  </div>
</template>

<script setup lang="ts">
//组件
//接口


//api
import {reactive, ref} from 'vue';

//data
type listType = {
  label: string,
  value: string
}
const props = defineProps<{
  list: listType[],
  modelValue:string|number
}>()
const isActive = ref<string|number>(props.modelValue)


const emit = defineEmits(['update:modelValue'])

/*
函数
*/

/**************************接口函数**************************/


/**************************操作函数**************************/
const chooseType = (type: number|string) => {
  isActive.value = type
  emit('update:modelValue', isActive.value)
}

</script>

<style lang="scss">

</style>
